<template>
  <div
    :class="[type]"
    class="mui-scroll-wrapper pullup-list"
  >
  <!-- 空数据提示 -->
    <div
      v-if="data.length == 0"
      class="je-list-emptytext"
    >
      {{ emptytext }}
    </div>
    <div class="mui-scroll" v-else>
      <div class="mui-table-view">
        <list-item
          v-for="(item,index) in data"
          :key="index"
          :data="item"
          :type="type"
          @resetList="resetList"
          @refreshDelay="refreshDelay"
          class="mui-table-view-cell"
        />
      </div>
    </div>
  </div>
</template>

<script>
import ListItem from './item';

export default {
  name: 'PullupList',
  components: { ListItem },
  props: {
    type: {
      type: String,
      default() {
        return '';
      },
    },
  },
  data() {
    return {
      data: [],
      emptytext:'暂无数据'
    };
  },
  created() {
    this.store = JE.createStore({
      url: JE.getUrlMaps('je.core.wf.taskInfo.getCurrentTask'),
      idName: 'taskId',
      params: {
        queryType: this.type,
        apkId: JE.getApkID(),
        searchName: '',
        startDate: '',
        endDate: '',
        wfKeys: '',
      },
    });
  },
  mounted() {
    this.initRefresh();
  },
  methods: {
    /**
     * 初始化数据，只执行一次
     */
    initData(type) {
      const me = this;
      if (!me.loaded || type) {
        me.load(1, (data) => {
          me.data = data.rows;
          me.loaded = true;
        });
      }
    },
    resetList() {
      this.load(1, (data) => {
        this.data = data.rows;
      });
    },
    /**
     * 加载数据
     * @param {int} page 页码
     * @param {function} callback 回调函数
     */
    load(page, config) {
      const me = this;
      if (JE.isFunction(config)) {
        config = { callback: config };
      }
      me.store.loadPage(page, {
        params: config.params,
        callback: (data) => {
          me.$emit('refreshBadge', data);
          config.callback && config.callback(data);
          // 刷新上拉加载状态
          me.refreshUpRefresh();
        },
      });
    },
    /**
     * 刷新数据
     */
    refresh(params) {
      // this.pullRefresh.pulldownLoading();
      // 刷新角标
      JE.refreshBadge();
      this.paramsData = params;
      const me = this;
      me.load(1, {
        params,
        callback: (data) => {
          me.data = data.rows;
          // setTimeout(()=>{
          //     mui(`#${this.type} .mui-scroll-wrapper`).scroll().refresh();
          // },10)
        },
      });
    },
    /**
     * 刷新延时
     */
    refreshDelay() {
      this.$emit('refreshDelay');
    },
    // 上下拉刷新
    initRefresh() {
      const me = this;
      const { type } = me;
      me.pullRefresh = mui(`.mui-scroll-wrapper.${me.type}`).pullRefresh4HTML({
        // 下拉刷新
        down: {
          callback() {
              // 下拉刷新角标
          JE.refreshBadge();
            const pull = this;
            // 加载数据处理
            if (JE.isNotEmpty(me.paramsData)) {
              if (type == 'PI_APPROVED' || type == 'PI_OWNER') {
                me.load(1, {
                  params: me.paramsData,
                  callback: (data) => {
                    me.data = data.rows;
                    // 结束加载，停止下拉
                    pull.endPulldownToRefresh();
                    // JE.msg('刷新成功!');
                  },
                });
              }
            } else {
              me.load(1, (data) => {
                me.data = data.rows;
                // 结束加载，停止下拉
                pull.endPulldownToRefresh();
                // JE.msg('刷新成功!');
              });
            }
          },
        },
        // 上拉加载
        up: {
          callback() {
            const up = this;
            if (JE.isNotEmpty(me.paramsData)) {
              if (type == 'PI_APPROVED' || type == 'PI_OWNER') {
                me.load(me.store.page + 1, {
                  params: me.paramsData,
                  callback: (data) => {
                    me.data = me.data.concat(data.rows);
                    // 结束加载，停止上拉
                    up.endPullupToRefresh();
                    JE.msg('加载成功!');
                  },
                });
              }
            } else {
              // 加载数据处理
              me.load(me.store.page + 1, (data) => {
                me.data = me.data.concat(data.rows);
                // 结束加载，停止上拉
                up.endPullupToRefresh();
                JE.msg('加载成功!');
              });
            }
          },
        },
      });
    },
    /**
     * 没有更多的数据，禁用加载
     */
    refreshUpRefresh() {
      const me = this;
      if (me.store.totalCount < me.store.pageSize || me.store.totalPage == me.store.page) {
        // 禁用上拉
        me.pullRefresh.disablePullupToRefresh();
      } else {
        // 启用上拉
        me.pullRefresh.enablePullupToRefresh();
      }
    },
  },
};
</script>
<style lang="less">
@import "~@/theme/index.less";
/*下拉刷新*/
.pullup-list {
  .je-list-emptytext {
      position: absolute;
      top: 40%;
      width: 100%;
      text-align: center;
      font-size: 20 * @hd;
      color: #bebebe;
    }
  .mui-pull-top-pocket {
    top: 0 !important;
  }
  .mui-table-view {
    &::before,
    &::after {
      height: 0;
      content: "";
    }
  }
}
</style>
